// 1.0 导入vue核心包
import Vue from 'vue';

// 2.0 导入App.vue的vue对象
import App from './App.vue';

// 3.0 将vue-router集成到这个项目中来
import VueRouter from 'vue-router';

// 3.0.1 将vueRouter对象绑定到Vue对象上
Vue.use(VueRouter);

// 3.0.3 导入路由规则对应的组件对象
import home from './components/Home.vue'; //主页组件
import shopcar from './components/shopcar/car.vue';    //购物车组件
import newslist from './components/news/newslist.vue'; //新闻资料列表组件
import newsinfo from './components/news/newsinfo.vue'; //新闻资料详情组件
import photolist from './components/photo/photolist.vue'; //图片分享列表组件
import photoinfo from './components/photo/photoinfo.vue'; //图片分享详情页组件
import goodslist from './components/goods/goodslist.vue'; //商品列表组件
import goodsinfo from './components/goods/goodsinfo.vue'; //商品详情组件
import goodsdesc from './components/goods/goodsdesc.vue'; //商品图文详情组件
import goodscomment from './components/goods/goodscomment.vue'; //商品评论组件
// 3.0.2 定义路由规则
var router  = new VueRouter({
	linkActiveClass:'mui-active', //改变路由激活时的class名称
	routes: [
		// 设置当服务器启动的时候默认进入 /home中
		{
			path: '/',
			redirect: '/home' //跳转到/home页面中 再直接询问/home页面
		},
		{
			path:'/home',
			component:home
		},
		{
			path:'/shopcar', //路由规则的路径
			component:shopcar
		},
		{ 	path: '/news/newslist', 
			component: newslist 
		}, //新闻资讯列表页面
		{
			path: '/news/newsinfo/:id',
			component: newsinfo
		}, //新闻资讯详情组件
		{
			path: '/photo/photolist',
			component: photolist
		}, //图片分享列表组件
		{
			path: '/photo/photoinfo/:id',
			component: photoinfo
		}, //图片分享详情组件
		{
			path: '/goods/goodslist',
			component: goodslist
		}, //商品列表组件
		{
			path: '/goods/goodsinfo/:id',
			component: goodsinfo
		}, //商品详情组件
		{
			path: '/goods/goodsdesc/:id',
			component: goodsdesc
		}, //商品图文详情组件
		{
			path: '/goods/goodscomment/:id',
			component: goodscomment
		} //商品评论组件
	]
})

// 4.0 注册mint-ui
// 导入mint-ui的css文件
import 'mint-ui/lib/style.min.css';
// 导入mint-ui组件对象
import mintui from 'mint-ui';
// 在Vue中全局使用mint-ui
Vue.use(mintui);

// 5.0 注册mui中的css样式
import '../statics/mui/css/mui.css';
// 6.0 导入当前系统的全局样式
import '../statics/css/site.css';

// 7.0 将vue-resource在vue中绑定，自动在vue对象实例上注入一个$http对象就可以使用ajax了
import vueResource from 'vue-resource';
Vue.use(vueResource);

//8.0 定义一个全局过滤器实现日期的格式化
import moment from 'moment';
Vue.filter('datefmt', function (input,fmtstring) {
	//使用momentjs这个日期格式化类库实现日期的格式化功能
	return moment(input).format(fmtstring);
});

//9.0 使用图片预览组件
import VuePreview from 'vue-preview'

Vue.use(VuePreview);

// 3.0 利用Vue对象进行解析渲染
new Vue({
	el:'#app',
	// render:function(create){create(App)} //es5的写法
	// 使用路由对象实例
	router:router,
	render:c=>c(App)  // es6的函数写法 =>：goes to
});